@extends('admin.layouts.app')

@section('content')
    <div class="admin-content">

        <div class="am-cf am-padding">
            <div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">商品分类管理</strong> /
                <small>Good Categories Manage</small>
            </div>
        </div>
<hr>
        @if(session('category'))
            <div class="am-g">
                <div class="am-u-md-12">
                    <div class="am-alert am-alert-success">
                        {{session('category')}}
                    </div>
                </div>
            </div>
        @endif

        <div class="am-g">
            <div class="am-u-sm-12 am-u-md-6">
                <div class="am-btn-toolbar">
                    <div class="am-btn-group am-btn-group-xs">
                        <a href="{{route('shop.goodsCategory.create')}}" class="am-btn am-btn-default">
                            <span class="am-icon-plus"></span> 新增
                        </a>
                        <button type="button" class="am-btn am-btn-success" id="show_all" href="">
                            <span class="am-icon-arrows-alt"></span> 展开所有
                        </button>
                    </div>
                </div>
            </div>
        </div>

        <div class="am-g">
            <div class="am-u-sm-12">
                <form class="am-form">
                    <table class="am-table  am-table-hover table-main">
                        <thead>
                        <tr>
                            <th class="table-id">编号</th>
                            <th>缩略图</th>
                            <th class="table-name" style="width: 20%;">分类名</th>
                            <th style="width: 20%;">分类商品</th>
                            <th class="table-is-show am-hide-sm-only">是否显示</th>
                            <th class="table-sort-order am-hide-sm-only" style="width:10%">排序</th>
                            <th class="table-set">操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        @foreach($categories as $category)
                        <tr data-id="{{$category->id}}" id="row_{{$category->id}}" class="xParent">
                            <td>{{$category->id}}</td>
                            <td>
                                @if($category->thumb)<img src="{{$category->thumb}}" alt class="thumb" ></td>@endif
                            <td>

                                {{$category->name}}
                            </td>
                            <td></td>

                            <td class="am-hide-sm-only">
                                {!!is_show('is_show',$category)!!}
                            </td>

                            <td class="am-hide-sm-only">
                                <input type="text" name="sort_order" class="am-input-sm" value="{{$category->sort_order}}">
                            </td>


                            <td>
                                <div class="am-btn-toolbar">
                                    <div class="am-btn-group am-btn-group-xs">
                                        <a class="am-btn am-btn-default am-btn-xs am-text-secondary" href="{{route('shop.goodsCategory.edit',[$category->id])}}">
                                            <span class="am-icon-pencil-square-o"></span> 编辑
                                        </a>

                                        <a class="am-btn am-btn-default am-btn-xs am-text-danger am-hide-sm-only" href="{{route('shop.goodsCategory.destroy',[$category->id])}}"
                                           data-method="delete" data-token="{{csrf_token()}}" data-confirm="确认删除吗?">
                                            <span class="am-icon-trash-o"></span> 删除
                                        </a>
                                    </div>
                                </div>
                            </td>
                        </tr>

                        @foreach($category->children as $c)
                            <tr data-id="{{$c->id}}" id="row_{{$category->id}}" class="xChildren child_row_{{$category->id}}" style="display: none">
                                <td>{{$c->id}}</td>
                                <td>
                                    @if($c->thumb)<img src="{{$c->thumb}}" alt class="thumb" style="height: 60px"></td>@endif
                                <td>
                                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
                                    {{$c->name}}
                                </td>
                                <td></td>

                                <td class="am-hide-sm-only">


                                        {!!is_show('is_show',$c)!!}

                                </td>

                                <td class="am-hide-sm-only">
                                    <input type="text" name="sort_order" class="am-input-sm" value="{{$c->sort_order}}">
                                </td>


                                <td>
                                    <div class="am-btn-toolbar">
                                        <div class="am-btn-group am-btn-group-xs">
                                            <a class="am-btn am-btn-default am-btn-xs am-text-secondary" href="{{route('shop.goodsCategory.edit',[$c->id])}}">
                                                <span class="am-icon-pencil-square-o"></span> 编辑
                                            </a>

                                            <a class="am-btn am-btn-default am-btn-xs am-text-danger am-hide-sm-only" href="{{route('shop.goodsCategory.destroy',[$c->id])}}"
                                               data-method="delete" data-token="{{csrf_token()}}" data-confirm="确认删除吗?">
                                                <span class="am-icon-trash-o"></span> 删除
                                            </a>
                                        </div>
                                    </div>
                                </td>
                            </tr>
                        @endforeach
                        @endforeach


                        </tbody>
                    </table>


                </form>
            </div>

        </div>
    </div>
    @endsection

@section('js')
    <script type="text/javascript">


        $(function(){
          /*  $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });*/

            //是否显示
            $('.is_something').click(function(){
                var _this=$(this);
                var id=$(this).parents("tr").attr('data-id');
                $.ajax({
                    url:"{{url('/shop/goodsCategory/is_show')}}",
                    type:'patch',
                    data:{id:id},
                    success:function (data) {
                        console.log(data);
                        _this.toggleClass('am-icon-close am-icon-check');
                    }
                })
            })


            //排序
            $("input[name='sort_order']").change(function () {
                var data = {
                    sort_order: $(this).val(),
                    id: $(this).parents("tr").attr('data-id')
                }

                $.ajax({
                    url:'/shop/goodsCategory/sort_order',
                    type: 'patch',
                    data: data,
                });
            })


            //展开所有
            $('#show_all').click(function(){
                $('.xParent').toggleClass('am-active')
                $('.xChildren').toggle();
            })

            //双击显示
            $('tr.xParent').dblclick(function(){
                $(this).toggleClass('am-active');
                var id=$(this).attr('id');
//                alert(id);
                $('.child_'+id).toggle();
            })
        })


    </script>


    @endsection